<html>
<head>
    <style>
        #scroller {
            height: 100px;
            overflow: auto;
        }
    </style>
</head>
<body>

<div id="main">

    this is outside of the inner scroller

    <div id="scroller">

        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.
        this should be some super long text and should be scrolled.

    </div>

</div>

<script>


    window.addEventListener('scroll', () => console.log('window scroll'), {capture: true});
    //
    // const scroller = document.getElementById('scroller');

    // scroller.addEventListener('scroll', () => console.log('scroller scrolled'));

    // document.addEventListener('scroll', () => console.log('document scroll'));


</script>

</body>
</html>
